$(function () {
  // 公共类
  let params = {
    key: "", //搜索关键词，可以为空，为空返回某类型所有文章
    type: "", //文章类型id，可以为空，为空返回所有类型文章
    state: "", //文章状态，草稿 ，已发布,为空返回所有状态文章
    page: 1, //当前页，为空返回第1页
    perpag: 10, //每页显示条数，为空默认每页6条
  };
  //1.获取所有文章数据
  function getAllArticle() {
    $.ajax({
      url: "http://localhost:8080/api/v1/admin/article/query",
      headers: { Authorization: localStorage.getItem("token") },
      data: params,
      dataType: "json",
      success: function (res) {
        let totalCountItem = res.data.totalCount;
        if (res.code === 200) {
          let list = res.data.data;
          const html = template("rticleListTemp", { list });
          $("#renderArticle").html(html);
          // 总条数
          renderPage(totalCountItem);
        } else {
          console.log("失败");
          console.log(res);
        }
      },
    });
  }
  //1.获取所有文章数据
  getAllArticle();

  // 2.渲染分页
  function renderPage(totalCountItem) {
    layui.use("laypage", function () {
      let laypage = layui.laypage;
      //执行一个laypage实例
      laypage.render({
        elem: "pager", //注意，这里的 test1 是 ID，不用加 # 号
        count: totalCountItem, //数据总数，从服务端得到
        limit: 10,
        curr: params.page,
        jump: function (obj, first) {
          //首次不执行
          if (!first) {
            params.page = obj.curr; //得到当前页，以便向服务端请求对应页的数据。
            getAllArticle();
          }
        },
      });
    });
  }
  // 2.渲染分页
  renderPage();

  // 3.渲染所有分类
  function renderCategory() {
    $.ajax({
      url: "http://localhost:8080/api/v1/admin/category/list",
      headers: { Authorization: localStorage.getItem("token") },
      dataType: "json",
      success: function (res) {
        let list = res.data;
        if (res.code === 200) {
          let html = "";
          html += `<option value=''>所有分类</option>`;
          list.forEach(function (data) {
            html += `<option value='${data.id}'>${data.name}</option>`;
          });
          $("#selCategory").html(html);
        } else {
          console.log("失败");
          console.log(res);
        }
      },
    });
  }
  // 3.渲染所有分类
  renderCategory();

  // 4.点击筛选所有文章类型
  $("#btnSearch").on("click", function () {
    // 获取用户输入的数据
    params.key = $("#aname").val();
    // 分类
    params.type = $("#selCategory").val();
    params.state = $("#selStatus").val();
    // 重置页码
    params.page = 1;
    getAllArticle();
  });
  // 5.点击重置 回到初始状态
  $("#AllReset").on("click", function () {
    params.key = $("#aname").val("");
    params.type = $("#selCategory").val("");
    params.state = $("#selStatus").val("");
    // 重新渲染
    params = {
      key: "", //搜索关键词，可以为空，为空返回某类型所有文章
      type: "", //文章类型id，可以为空，为空返回所有类型文章
      state: "", //文章状态，草稿 ，已发布,为空返回所有状态文章
      page: 1, //当前页，为空返回第1页
      perpag: 10, //每页显示条数，为空默认每页6条
    };
    getAllArticle();
  });
  // 6.点击删除文章
  $("#renderArticle ").on("click", ".delete", function () {
    let id = $(this).parents("tr").data("id");

    layer.confirm("请问确认删除？", function (index) {
      $.ajax({
        url: "http://localhost:8080/api/v1/admin/article/delete",
        headers: { Authorization: localStorage.getItem("token") },
        data: { id },
        type: "post",
        dataType: "json",
        success: function (del) {
          if (del.code === 200) {
            getAllArticle();
            layer.close(index);
          } else {
            console.log("失败");
            console.log(res);
          }
        },
      });
    });
  });
});
